<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>邀请注册</title>
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="${ctxStatic}/bootstrap/bootstrap.min.css" />
		<link rel="stylesheet" type="text/css" href="${ctxStatic}/custom/css/flat-ui.css" />
		<link rel="stylesheet" type="text/css" href="${ctxStatic}/custom/css/regstyle.css" />
		<script type="text/javascript" src="${ctxStatic}/jquery/jquery-1.9.1.min.js"></script>
		<script type="text/javascript" src="${ctxStatic}/custom/js/validate.js"></script>
		<script type="text/javascript">
			$(function() {
				/*改变div的高度*/
				$(".yq_container").height($(window).height());
			});
		</script>
		<script type="text/javascript">
			$(document).ready(function() {
				
				var interValObj; //timer变量，控制时间
				var count = 60; // 间隔函数，1秒执行
				var curCount; // 当前剩余秒数
				
				$("#name").focus();
				
				$("#btnSubmit").click(function(){
					registSubmit();
				});
				
				$("#sendMsg").click(function(){
					
					curCount = count;
					$("#sendMsg").attr("disabled", "true");
					$("#sendMsg").val("请在"+curCount+"秒内输入验证码");
					interValObj = window.setInterval(function(){ //timer处理函数  
						
						 if (curCount == 0) {
					            window.clearInterval(interValObj);// 停止计时器    
					            $("#sendMsg").removeAttr("disabled");// 启用按钮    
					            $("#sendMsg").val("重新发送验证码");
					            //code = ""; // 清除验证码。如果不清除，过时间后，输入收到的验证码依然有效    
					        } else {
					            curCount--;
					            $("#sendMsg").val("请在" + curCount + "秒内输入验证码");
					        }
					}, 1000); // 启动计时器，1秒执行一次
					
					sendMsg();
				});
			});
			
		</script>
	</head>
	<body>
		<div class="container-fluid yq_container">
			<div class="row pic_box">
				<img src="${ctxStatic}/custom/img/title_img.png" height="120" class="center-block" />
			</div>
			<img src="${ctxStatic}/custom/img/bg_7.png" width="100%" height="100%" style="position: absolute; top:0; left: 0; z-index: 0;">
			<form class="my_form" id="registForm">
				<div class="form-group">
					<input type="text" class="form-control" id="name" placeholder="姓名">
					<input type="hidden" id="inviteCode" value="${inviteCode}"/>
				</div>
				<div class="form-group">
					<input type="password" class="form-control" id="password" placeholder="密码">
				</div>
				<div class="form-group">
					<input type="password" class="form-control" id="confirmPassword" placeholder="确认密码">
				</div>
				<div class="form-group">
					<div class="phone_num">
						<input type="text" class="form-control" id="phone" placeholder="手机号">
						<!-- <button type="button" id="sendMsg" class="btn btn-warning yzm_btn">发送验证码</button> -->
						<input type="button" id="sendMsg" class="btn btn-warning yzm_btn" value="发送验证码"/>
					</div>
				</div>
				<div class="form-group">
					<input type="text" class="form-control" id="code" placeholder="输入验证码">
				</div>
				<button type="button" id="btnSubmit" class="btn btn-success my_btn_success" data-toggle="modal">注 册</button>
				<!-- model -->
				<div style="display: none" id="modalDiv" class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
					<div class="modal-dialog modal-lg">
						<div class="modal-content">
							<div class="modal-header">
								您已提交成功
							</div>
							<div class="modal-footer">
								<a href="${ctxFront}/pay/download" type="button" class="btn btn-success">确定</a>
							</div>
						</div>
					</div>
				</div>
			</form>
		</div>

		<script type="text/javascript" src="${ctxStatic}/bootstrap/bootstrap.min.js"></script>
		<script type="text/javascript">

			$('.modal').modal({
				backdrop: 'static',
				keyboard: false
			});
			$('.modal').modal('hide');
		</script>
		
		<script type="text/javascript">
			
			function sendMsg(){
				
				var phone = $("#phone").val();
				var result = '';
				var errorNum = 0;
				
				if($.trim(phone).length == 0){
					errorNum++;
					result += errorNum + '、手机号没有输入\n';
					$("#phone").focus();
				} else {
					if(isPhoneNo($.trim(phone)) == false){
						errorNum++;
						result += errorNum + '、手机号码不合法\n';
						$("#phone").focus();
					}
				}
				
				if(result != ''){
					alert(result);
					return false;
				} else {
					
					$.ajax({  
	                    type : "POST",  //提交方式  
	                    url : "${ctxFront}/pay/sendMsg",//路径  
	                    data : {  
	                       "phone": phone
	                    },//数据，这里使用的是Json格式进行传输  
	                    success : function(result) {//返回数据根据结果进行相应的处理 
	                    	var data = eval("("+result+")");
	                        if (data.success) {  
	                        	
	                        } else {  
	                        	$("#sendMsg").val("验证码发送失败，请稍后重试");
	                        }  
	                    }  
	                }); 
					
				}
			}
			
			function registSubmit(){
				
				var inviteCode = $("#inviteCode").val();
				var name = $("#name").val();
				var phone = $("#phone").val();
				var password = $("#password").val();
				var confirmPassword = $("#confirmPassword").val();
				var code = $("#code").val();
				
				var result = '';
				var errorNum = 0;
				if($.trim(name).length == 0){
					errorNum++;
					result += errorNum + '、姓名没有输入\n';
					$("#name").focus();
				} else {
					if(isChinaName($.trim(name)) == false){
						errorNum++;
						result += errorNum + '、姓名不合法\n';
						$("#name").focus();
					}
				}
				
				if($.trim(password).length == 0){
					errorNum++;
					result += errorNum + '、密码没有输入\n';
					$("#password").focus();
				} else {
					if($.trim(password) != $.trim(confirmPassword)){
						errorNum++;
						result += errorNum + '、两次密码输入不一致\n';
						$("#confirmPassword").focus();
					}
				}
				
				if($.trim(phone).length == 0){
					errorNum++;
					result += errorNum + '、手机号没有输入\n';
					$("#phone").focus();
				} else {
					if(isPhoneNo($.trim(phone)) == false){
						errorNum++;
						result += errorNum + '、手机号码不合法\n';
						$("#phone").focus();
					}
				}
				
				if($.trim(code).length == 0){
					errorNum++;
					result += errorNum + '、验证码没有输入\n';
					$("#code").focus();
				} else {
					if($.trim(code).length != 4){
						errorNum++;
						result += errorNum + '、验证码不合法\n';
						$("#code").focus();
					}
				}
				
				if(result != ''){
					alert(result);
					return false;
				} else {
					
					$.ajax({  
	                    type : "POST",  //提交方式  
	                    url : "${ctxFront}/pay/inviteRegSubmit",//路径  
	                    data : {  
	                        "inviteCode": inviteCode,
	                        "password": password,
	                        "name": name,
	                        "phone": phone,
	                        "code": code
	                    },//数据，这里使用的是Json格式进行传输  
	                    success : function(result) {//返回数据根据结果进行相应的处理 
	                    	var data = eval("("+result+")");
	                        if (data.success) {  
	                        	$("#modalDiv").modal({show: true});
	                        } else {  
	                        	$("#modalDiv").modal('hide');
	                        	if(data.existUser){
	                        		alert("该手机号已注册！");
	                        		return false;
	                        	} else if(data.invalidCode){
	                        		alert("验证码错误！");
	                        		return false;
	                        	} 
	                        }  
	                    }  
	                }); 
					
				}
			}
			
			/* function modalHide(){
				$("#modalDiv").modal('hide');
			} */
		</script>
	</body>
</html>